<!-- 入驻信息 -->
<template>
	<a-descriptions title="企业信息" class="ant-descriptions-blockquote">
		<a-descriptions-item label="企业名称">{{ props.enterpriseData?.enterPriseName }}</a-descriptions-item>
		<a-descriptions-item label="社会信用统一代码">{{ props.enterpriseData?.societyCode }}</a-descriptions-item>
		<a-descriptions-item label="企业法人">{{ props.enterpriseData?.enterPriseLegal }}</a-descriptions-item>
		<a-descriptions-item label="企业电话">{{ props.enterpriseData?.enterPrisePhone }}</a-descriptions-item>
		<a-descriptions-item label="企业地址">{{ props.enterpriseData?.enterPriseAddress }}</a-descriptions-item>
	</a-descriptions>

	<a-typography-paragraph strong>
		<blockquote>联系人信息</blockquote>
	</a-typography-paragraph>
	<vxe-grid v-bind="contactGridOptions" :data="props.enterpriseData?.contacts || []" />

	<a-typography-paragraph strong>
		<blockquote>合作信息</blockquote>
	</a-typography-paragraph>
	<vxe-grid ref="grid" v-bind="teamworkGridOptions" :data="props.enterpriseData?.teamworks || []">
		<template #cycle="{row}">{{ row.beginTime || '-' }} ~ {{ row.endTime || '-' }}</template>
		<template #file="{row}">
			<a @click="lookAttachments(row.id)">查看协议附件</a>
		</template>
		<template #name="{row}">
			<a @click="grid.toggleRowExpand(row)">查看优惠协议方案</a>
		</template>
		<template #discounts="{row}">
			<a-descriptions size="small" colon bordered class="discount-descriptions">
				<template v-for="discount in row.discounts || []" :key="discount.id">
					<a-descriptions-item label="优惠名称">
						{{ discount.discountName }}
					</a-descriptions-item>
					<a-descriptions-item label="优惠有效期">
						{{ discount.beginTime || '-' }} ~ {{ discount.endTime || '-' }}
					</a-descriptions-item>
					<a-descriptions-item label="优惠方案">
						{{ discountTypeMap[discount.discountType] }} 、 {{ discount.discountScale }}% 、
						{{ discount.feeSubjects.map(o => o.name).join('/') }} 、
						{{ discount.stackable ? '可叠加' : '不可叠加' }}
					</a-descriptions-item>
				</template>
			</a-descriptions>
		</template>
	</vxe-grid>
	<br />
	<a-descriptions title="备注" class="ant-descriptions-blockquote">
		<a-descriptions-item label="备注">{{ props.enterpriseData?.remark }}</a-descriptions-item>
	</a-descriptions>
	<a-descriptions title="其他信息" class="ant-descriptions-blockquote">
		<a-descriptions-item label="录入人">{{ props.enterpriseData?.createName }}</a-descriptions-item>
		<!-- <a-descriptions-item label="维护人">{{ props.enterpriseData?.preservePerSionName }}</a-descriptions-item> -->
	</a-descriptions>

	<!-- 回显附件 -->
	<file-upload-dialog v-model:visible="record.attachment" :biz-id="record.attId" :isDetails="true" />
</template>

<script setup lang="ts">
	import {reactive, ref} from 'vue'
	import {VxeGridProps, VxeTableEvents} from 'vxe-table'
	import {discountTypeMap} from '@/constant/enterprise-customers'
	import FileUploadDialog from '@/components/common/file-upload-dialog.vue'

	const props = withDefaults(
		defineProps<{
			enterpriseData: any
		}>(),
		{
			enterpriseData: {}
		}
	)
	const record = reactive({
		attachment: false,
		attachments: [],
		attId: ''
	})

	const lookAttachments = (id: string) => {
		record.attId = id
		record.attachment = true
	}

	const grid = ref()

	const contactGridOptions = reactive<VxeGridProps>({
		size: 'mini',
		maxHeight: '200',
		showOverflow: true,
		rowConfig: {
			isHover: true
		},
		columns: [
			{
				minWidth: 150,
				title: '联系人姓名',
				field: 'linkmanName'
			},
			{
				title: '联系人性别',
				field: 'gender',
				formatter({row}) {
					return row.gender === 1 ? '男' : '女'
				}
			},
			{
				minWidth: 150,
				title: '联系人手机号',
				field: 'linkmanPhone'
			},
			{
				minWidth: 150,
				title: '联系人职位',
				field: 'linkmanPost'
			},
			{
				title: '首选联系人',
				width: 100,
				field: 'isFirstChoice',
				formatter({cellValue}) {
					return cellValue ? '是' : '否'
				}
			}
		]
	})

	const teamworkGridOptions = reactive<VxeGridProps>({
		size: 'small',
		maxHeight: '300',
		showOverflow: true,
		rowConfig: {
			isHover: true
		},
		expandConfig: {
			showIcon: false,
			accordion: false
		},
		columns: [
			{
				title: '合作周期',
				width: 300,
				type: 'expand',
				slots: {
					default: 'cycle',
					content: 'discounts'
				}
			},
			{
				// 开票状态
				title: '附件',
				width: 200,
				slots: {
					default: 'file'
				}
			},
			{
				// 开票状态
				title: '协议优惠方案名称',
				slots: {
					default: 'name'
				}
			}
		]
	})
</script>

<style lang="less" scoped>
	.discount-descriptions {
		padding: 12px;

		:deep .ant-descriptions-row {
			th,
			td {
				font-size: 12px;
				padding: 4px 8px;
			}
		}
	}
</style>
